<template>
    <div class="app-container">
        <el-form :model="queryParams" size="mini" ref="queryForm" :inline="true" v-show="showSearch"
            label-width="130px">
            <el-form-item label="学号" prop="stuNo">
                <el-input v-model="queryParams.stuNo" placeholder="请输入学号" clearable @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="学生姓名" prop="stuName">
                <el-input v-model="queryParams.stuName" placeholder="请输入学生姓名" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="请假时间段" prop="leaveTime">
                <el-date-picker v-model="leaveTime" type="daterange" range-separator="至" start-placeholder="开始日期"
                    end-placeholder="结束日期" value-format="yyyy-MM-dd HH:mm:ss" />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
                <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
            </el-form-item>
        </el-form>

        <el-row :gutter="10" class="mb8">
            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>

        <el-table :data="tableData">
            <el-table-column label="年级" align="center" prop="gradeName" />
            <el-table-column label="专业" align="center" prop="majorName" />
            <el-table-column label="班级" align="center" prop="className" />
            <el-table-column label="学号" align="center" prop="stuNo" />
            <el-table-column label="姓名" align="center" prop="stuName" />
            <el-table-column label="请假次数" align="center" prop="leaveCount" />

            <!-- <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                <template slot-scope="scope">
                    <el-button size="mini" type="text" icon="el-icon-view" @click="lookVClick(scope.row)">查看</el-button>
                </template>
</el-table-column> -->
        </el-table>

        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize" @pagination="getList" />



    </div>
</template>
<script>
import { listFdyCount as getList, doAudit, listCourse } from "@/api/leave/leaveApply";

import { fullLoading, isEmpty } from "@/api/helpFunc/index";

export default {
    name: "leave-fdy",
    dicts: ['leave_apply_status'],
    data() {
        return {
            queryParams: {
                pageNum: 1,
                pageSize: 10,
            },
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            total: 0,

            tableData: [],

            leaveTime: []

        }
    },
    created() {
        this.getList();
    },
    methods: {
        /** 搜索按钮操作 */
        handleQuery() {
            console.log(this.leaveTime);
            if (this.leaveTime.length > 0) {
                this.queryParams.startTime = this.leaveTime[0];
                this.queryParams.endTime = this.leaveTime[1];
            }
            this.queryParams.pageNum = 1;
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.leaveTime = [];
            this.resetForm("queryForm");
            this.handleQuery();
        },

        async getList() {
            let loading = fullLoading(this);
            let res = await getList(this.queryParams);
            loading.close();
            if (res.code == 200) {
                this.total = res.total;
                this.tableData = [...res.rows];
            }
        },
        handleExport() {
            this.download('leave/apply/exportCount', {
                ...this.queryParams
            }, `请假统计_${new Date().getTime()}.xlsx`)
        }


    }
}

</script>
<style scoped lang="scss">
.lookForm {
    .el-form-item {
        margin-bottom: 5px;
    }
}
</style>